const StyleLintPlugin = require('stylelint-webpack-plugin');
const path = require('path');
// 将打包后的 JS/CSS/IMG/FONTS 等资源统一放到 static 目录中
const ASSERTS_DIR = 'static';

module.exports = {
    // lint错误是否需要展示 warning 只展示警告 true 错误和警告都展示 false都不展示
    lintOnSave: process.env.NODE_ENV === 'development' ? 'warning' : false,

    // 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。
    assetsDir: process.env.NODE_ENV !== 'development' ? ASSERTS_DIR : '',

    // 部署的路径 默认是 / 是域名的根路径；如果是某个文件下可以设置 /filename/
    publicPath: './',

    // 默认情况下，生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存。然而，这也要求 inde      x的 HTML 是被 Vue CLI 自动生成的。如果你无法使用 Vue CLI 生成的 index HTML，你可以通           过将这个选项设为 false 来关闭文件名哈希 默认就是true；
    filenameHashing: true,

    // 这个配置在webpack打包的工程不需要 因为模板和js是分开的 当模板 new Vue({template:'xxx'})
    runtimeCompiler: false,

    // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。默认设置true
    productionSourceMap: true,

    //integrity在生成的 HTML 中的 <link rel="stylesheet"> 和 <script> 标签上启用 Subresource Integrity (SRI)。如果你构建后的文件是部署在 CDN 上的，启用该选项可以提供额外的安全性
    integrity: true,

    // 用来配置多文件
    // pages: {
    // 	index: {
    // 		// page 的入口
    // 		entry: 'src/index/main.js',
    // 		// 模板来源
    // 		template: 'public/index.html',
    // 		// 在 dist/index.html 的输出
    // 		filename: 'index.html',
    // 		// 当使用 title 选项时，
    // 		// template 中的 title 标签需要是 <title><%= htmlWebpackPlugin.options.title %></title>
    // 		title: 'Index Page',
    // 		// 在这个页面中包含的块，默认情况下会包含
    // 		// 提取出来的通用 chunk 和 vendor chunk。
    // 		chunks: ['chunk-vendors', 'chunk-common', 'index']
    // 	},
    // 	// 当使用只有入口的字符串格式时，
    // 	// 模板会被推导为 `public/subpage.html`
    // 	// 并且如果找不到的话，就回退到 `public/index.html`。
    // 	// 输出文件名会被推导为 `subpage.html`。
    // 	subpage: 'src/subpage/main.js'
    // },

    //配置项目启动后的端口和代理
    devServer: {
        port: 8006,
		open: true,
        // 处理跨域可以将前端发送的未知请求可以代理到该链接上 项目接口直接写 url=logout即可
        //proxy: 'http://localhost:3000',

        //也可以配置多个代理地址
        // 举个例子: 接口地址 http://localhost:3000/logout
        // 如果按照下文配置 ，那么项目url应该 url=logout即可；
        // proxy: {
        // '/': {
        //   target: 'http://localhost:3000',
        //   ws: true,
        //   changeOrigin: true
        // },
        //       '/foo': {
        //         target: 'http://localhost:4000/foo'
        //       }
        //     }

        // 数据mock 启用express
        // before(app) {
        //     app.get('/api/list', (req, res) => {
        //         res.json([1, 2, 3]);
        //     });
        // }
    },

    //webpack配置 需要按照eslint校验的文件
    configureWebpack: {
		// resolve: {
		// 	alias: {
		// 		'@':"/src/"
		// 	}
		// },
        plugins: [
            new StyleLintPlugin({
                files: ['src/**/*.{vue,htm,html,css,sss,less,scss,sass}']
            })
        ]
    },

    chainWebpack: (config) => {
        const types = ['vue-modules', 'vue', 'normal-modules', 'normal'];
        // 项目使用scss
        types.forEach((type) => addStyleResource(config.module.rule('less').oneOf(type)));
    },
	css: {
	    loaderOptions: {
	    css: {},
		
		// 用于移动端配置

	    // postcss: {
	    //     plugins: [
	    //     require('postcss-px2rem')({
	    //         remUnit: 37.5
	    //     })
	    //     ]
	    //     }
	    }
	  }
};

// 自动化导入样式文件 (用于颜色、变量、mixin等)，可以使用 style-resources-loader
// https://cli.vuejs.org/zh/guide/css.html#%E8%87%AA%E5%8A%A8%E5%8C%96%E5%AF%BC%E5%85%A5
function addStyleResource(rule) {
    rule.use('style-resource')
        .loader('style-resources-loader')
        .options({
            patterns: [path.resolve(__dirname, './src/styles/mixins/common-mixins.less')]
        });
}
